<html>
<head>
    <title>nhao</title>
</head>
<body>
<div class="login-background" id="login-background">
    PLEASE LOGIN IN WIETH YOUR NAME TOKEN
    <div class="login-box">
        <form action="/authentication/form" method="post">
            <div class="title">
                <label><font size="4">请输入登录信息</font></label>
            </div>
            <div class="username">
                <label for="userName"><img src="" alt=""></label>
                <input id="userName" name="userName" type="text" autocomplete="off" maxlength="12" placeholder="请输入用户名" required>
                <label ><img src="" alt=""></label>
            </div><br>
            <div class="password">
                <label ><img src="" alt=""></label>
                <!--                设置两个相同的input，防止浏览器记住密码-->
                <input id="userPwd" name="userPwd" type="text" autocomplete="off" maxlength="10" placeholder="请输入密码" required>
                <label ><img src="" alt=""></label>
            </div><br>
            <div class="rememberMe">
                <label>记住我</label>
                <input type="checkbox" name="rememberMe">
            </div>
            <input type="submit" value="登录"> <!--提交之后可以使用$.submit -->
        </form>
    </div>
</div>

<script src="/js/jquery.js"></script>
<script type="text/javascript">
    // $("form").submit(function () {
    //     console.log("执行了方法");
    //     //必须封装为Json对象后台才能够以对象接收
    //     let formObj = {};
    //     //响应的JSON数组
    //     let formArray = $("form").serializeArray(); //序列化表单元素（类似 .serialize () 方法 ），返回 JSON 数据结构数据。. 注意： 此方法返回的是 JSON 对象而非 JSON 字符串
    //     $.each(formArray,function (i,item) {
    //         formObj[item.name] = item.value;
    //     });
    //     //使用AJAX，创建POST请求,访问8888/article
    //     $.ajax({
    //         type: 'POST',
    //         url: "/securityDemo/toLogin", //指定处理路径，和security配置中一致
    //         contentType: 'application/json',
    //         data: JSON.stringify(formObj), //将一个 JavaScript 对象或值转换为 JSON 字符串；JSON字符串，不是JSON对象
    //         success: function () {
    //             alert(data);
    //         }
    //     })
    // })


        // if(!$("#userName").val() || !$("#userPwd").val()) {
        //     alert("不能为空");
        //     return false;
        // }
        // $.post("/securityDemo/login/register",{"userName":$("#userName").val(),"userPwd":$("#userPwd").val()},
        //     function(response) {
        //         console.info(response);
        //         if(response && response.errorMsg) {
        //             alert(response.errorMsg);
        //             return false;
        //         } else {
        //             alert("登录成功");
        //             location.href = "index.html";
        //         }
        //     })
</script>
</body>
</html>


